<template>
  <div class="app-container">
    <basic-table
      :table-title="tableTitle"
      :multiple-table="false"
      :search-form="searchForm"
      :data-source="dataSource"
      :data-params="dataParams"
      :reload="reload"
      @closeReload="closeReload"
    />
  </div>
</template>
<script>
import BasicTable from '@/components/BasicTable/index.vue'

import { GetLoginPages } from '@/api/Login'

const startTime = (new Date()).getFullYear() + '-' + ((new Date()).getMonth() + 1) + '-' + (new Date()).getDate() + ' 00:00:00'
const endTime = (new Date()).getFullYear() + '-' + ((new Date()).getMonth() + 1) + '-' + (new Date()).getDate() + ' 23:59:59'
export default {
  name: 'ImLogs',
  components: { BasicTable },
  data() {
    return {
      dataSource: () => GetLoginPages,
      dataParams: {
        fLoginTime: startTime,
        tLoginTime: endTime
      },
      loading: false,
      reload: false,
      tableTitle: [
        {
          label: '用户名',
          value: 'UserName',
          show: true
        },
        {
          label: '公司名称',
          value: 'CompanyName',
          show: true
        },
        {
          label: 'IP',
          value: 'IPAddress',
          show: true
        },
        {
          label: 'MAC地址',
          value: 'MACAddress',
          show: true
        },
        {
          label: '类型',
          value: 'LogType',
          show: true,
          width: 80,
          transfer: {
            1: '登入',
            2: '登出'
          }
        },
        {
          label: '登录时间',
          value: 'LoginTime',
          show: true,
          width: 200
        }
      ],
      searchForm: {
        expend: true,
        title: '表格筛选',
        size: 'small',
        fields: [
          {
            show: true,
            type: 'input',
            label: '用户名',
            labelShow: true,
            name: 'userName'
          },
          {
            show: true,
            type: 'input',
            label: '公司名称',
            labelShow: true,
            name: 'companyName'
          },
          {
            show: true,
            type: 'datePicker',
            label: '时间',
            labelShow: true,
            name: ['fLoginTime', 'tLoginTime'],
            isRange: true
          }
          // {
          //   show: true,
          //   type: 'dateTimePicker',
          //   label: '登录时间',
          //   labelShow: true,
          //   name: ['fLoginTime', 'tLoginTime'],
          //   value: [startTime, endTime],
          //   isRange: true,
          //   clearable: false,
          //   onChange: (value) => {
          //     console.log('on change', value)
          //   }
          // }
        ]
      }
    }
  },
  methods: {
    closeReload(val) {
      this.reload = val
    }
  }
}
</script>
